<div class="grid grid-cols-9 grid-rows-5 h-(screen-16)">
  {{- $imgLeft := partial "utils/get-image" (dict "context" . "url" .Params.imgLeft)}}
  {{- with $imgLeft }}
  <div class="col-start-2 col-span-4 row-start-3 row-span-2 bg-local bg-cover z-10 shadow-2xl"
    style="background-image: url({{ . }});"></div>
  {{- end }}

  <div class="col-start-3 col-span-5 row-start-2 row-span-3 z-20">
    <div class="flex flex-col items-center justify-center min-h-full">
      <div class="bg-white bg-opacity-75 shadow-2xl -m-12 p-12">
        <span class="font-bold text-black text-opacity-75 text-2xl md:text-3xl">{{ .Params.slogan }}</span>
      </div>
    </div>
  </div>
  {{- $imgRight := partial "utils/get-image" (dict "context" . "url" .Params.imgRight)}}
  {{- with $imgRight }}
  <div class="col-start-5 col-span-4 row-start-2 row-span-2 bg-local bg-cover shadow-2xl"
    style="background-image: url({{ . }});">
  </div>
  {{- end }}
</div>